<template>
	<view class="content">
		<view class="shipping-address unify-background-color unify-flex">
			<view class="shipping-address-item unify-flex unify-margin">
				<view class="shipping-address-left unify-flex">
					<view class="iconfont el-icon-dizhi unify-weight"></view>
					<view class="shipping-address-info unify-weight">
						{{address.consignee}} {{address.phone}}

						<view class="shipping-address-details unify-font-size-two-line-astrict">
							{{address.detail}}
						</view>
					</view>
				</view>
				<view class="iconfont el-icon-icon12 unify-rotate90" v-if="isShow"></view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			isShow: {
				type: Boolean,
				default: true
			},
			address: {
				type: Object,
				default: null
			}
		}
	}
</script>

<style lang="scss" scoped>
	.shipping-address {
		height: 160rpx;
		max-height: 160rpx;
		align-items: center;

		.shipping-address-item {
			width: 100%;
			align-items: center;
			justify-content: space-between;

			.shipping-address-left {
				width: 80%;
				justify-content: space-between;

				.shipping-address-info {
					width: 88%;
					font-size: $uni-font-size-base;
				}

				.shipping-address-details {
					font-size: $uni-font-size-sm;
					margin-top: 10rpx;
					color: $uni-text-color-grey;
					font-weight: 500;
				}
			}

			.iconfont {
				font-size: $uni-font-size-base;
				margin-top: 8rpx;
			}
		}
	}
</style>
